import React from 'react';
import {observer} from 'mobx-react';
import './style.scss'
import {Input,Form,Icon,Button,Checkbox} from 'antd'
import home from '../../static/home.png'
import homeStore from "../../store/homeStore";
@observer
class Index extends React.Component {


    render() {
        return(
            <div className={'bg'}>
                <img src={home} className={'back'} />
                <div className={'content center'}>
                    <div className={'left'}>

                    </div>
                    <div className={'right'}>
                        <div className={'login-font'}>登录</div>
                        <Form onSubmit={homeStore.getInfo}>
                            <Form.Item>
                                <div className={'login-input-title'}>用户名</div>
                                <Input
                                    className={'input'}
                                    prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
                                    placeholder="请输入用户名"
                                    value={homeStore.username}
                                    onChange={homeStore.setUn}
                                />
                            </Form.Item>
                            <Form.Item>
                                <div className={'login-input-title'}>密码</div>
                                <Input
                                    className={'input'}
                                    prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
                                    type="password"
                                    placeholder="请输入密码"
                                    value={homeStore.password}
                                    onChange={homeStore.setPw}
                                />
                            </Form.Item>
                            <Form.Item>
                                <div className={'login-check'}>
                                    <Checkbox>记住密码</Checkbox>
                                    <a className="login-form-forgot" href="">
                                        忘记密码
                                    </a>
                                </div>
                                <Button className={'login'} type="primary" htmlType="submit">
                                    登录
                                </Button>
                                <a href="">现在注册</a>
                            </Form.Item>
                        </Form>
                    </div>
                </div>
            </div>
            )
    }
}

export default Index;
